﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>AngularJS 服务(Service)</title>
    <script type="text/javascript" src="Scripts/angular.js"></script>
</head>
<body ng-app="myApp" >
    <div ng-controller="myCtrl">
        <p>$location.absUrl(): {{myUrl}}</p>
        <p>$location.path(): {{myPath}}</p>
        <p>$http; {{myHtml}}</p> 
        <p>$timeout; {{myHeader}}</p>
        <p>$interval; {{theTime}}</p>
        <p>自定义服务; {{hex}}</p>
        <p>在过滤器中使用服务:{{255 | myFormat}}</p>
        <p>在获取数组 [255, 251, 200] 值时使用过滤器:</p>

        <ul>
            <li ng-repeat="x in counts">{{x | myFormat}}</li>
        </ul>
    </div>
    <script type="text/javascript">
        var app = angular.module("myApp", []);
        //自定义一个服务
        app.service('hexafy', function () {
            this.myFunc = function (x) {
                return x.toString(16);
            }
        });
        //自定义过滤器
        app.filter('myFormat', ['hexafy', function (hexafy) {
            return function (x) {
                return hexafy.myFunc(x);
            };
        }]);
        app.controller("myCtrl", function ($scope, $location, $http, $timeout, $interval, hexafy) {
            $scope.myUrl = $location.absUrl();
            $scope.myPath = $location.path();
            $http.get("L002.html").then(function (response) {
                $scope.myHtml = response.data;
            });
            $scope.myHeader = "Hello World!";
            $timeout(function () {
                $scope.myHeader = "How are you today?";
            }, 2000);
            $scope.theTime = new Date().toLocaleTimeString();
            $interval(function () {
                $scope.theTime = new Date().toLocaleTimeString();
            }, 1000);
            $scope.hex = hexafy.myFunc(255);
            $scope.counts = [255, 251, 200];
        });

    </script>
</body>
</html>